$bg-color: #F8F8F8;
$font-color: #333333;
$theme-color: #007AFF;
$app-nav-height: 159rpx;

@mixin flex($c: row) {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: $c;
}

@mixin abs($t: 0, $l: 0, $w: 100%, $h: 100%) {
	top: $t;
	left: $l;
	width: $w;
	height: $h;
	position: absolute;
}

.flex {
	@include flex();
}

.cflex {
	@include flex(column);
}

.justify-around {
	justify-content: space-around;
}

.ellipsis { // 单行文字溢出打点换行
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.ellipsis2 { // 两行行文字溢出打点换行
	overflow : hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	word-break: break-all;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
}

@mixin ellipsis($l: 2) { // 多行文字打点换行
	overflow : hidden;
	display: -webkit-box;
	-webkit-line-clamp: $l;
	word-break: break-all;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
}

.nav-bar {
	width: 100%;
	height: 88rpx;
	position: relative;
	margin-bottom: 4rpx;
	border-bottom: 1rpx solid #F1F1F1;
	.nav-bar-items {
		@include flex();
		height: 100%;
		.nav-bar-item {
			@include flex();
			flex: 1;
			height: 100%;
			font-size: 32rpx;
			&.active {
				color: #FF0000;
				font-size: 36rpx;
			}
		}
	}
	.nav-bar-drog {
		@include flex();
		left: 0rpx;
		bottom: 0rpx;
		height: 8rpx;
		width: 150rpx;
		position: absolute;
		text {
			height: 100%;
			width: 72rpx;
			border-radius: 8rpx;
			background: #FF0000;
		}
	}
}
.nav-view {
	flex: 1;
	width: 100%;
	swiper {
		width: 100%;
		height: 100%;
	}
}

.t {
	@include flex();
	font-size: 44rpx;
	line-height: 88rpx;
	text-align: center;
}
.p {
	text-indent: 2em;
	font-size: 32rpx;
	line-height: 54rpx;
}

.theme-color {
	color: $theme-color;
}

.bold {
	font-weight: bold;
}

.url {
	margin: 8rpx 0;
	font-size: 24rpx;
}

rich-text {
	margin: 8rpx 0;
}

view {
	user-select: auto;
}
text {
	user-select: auto;
}